import { ToastComponent, render as renderAmis } from 'amis';
import { useAsyncEffect, udp, Layout, Button, cssVar } from '@cscec/udp-ui';
import { useContext } from 'react';
import { Empty, FloatButton } from 'antd';
import { getEnableHomepage, getHomepageNameById, getPersonalEnableHomepage, getPersonalHomepageById, getUserEnableWorkbench, getUserWorkbenchById, getWorkbenchTemplateById } from './service';
import { getAmisEnv, schemaUtil } from '@/components/editor/util';
import { portalWrapper } from '../common';
import type { IStore } from './type';
import { loadResource } from '@/components/editor/plugin';
import { DesignContext, type IDCtx } from '@/components/editor/context';
import React from 'react';
import { SettingFilled } from '@ant-design/icons';

const global = window as any;

function UILayout({ session, personal = false }: { session?: string; personal?: boolean }) {
  const { id, type } = udp.getQueryValue();
  const preview = session !== 'render';
  const { store, setStore } = useContext<IDCtx<IStore>>(DesignContext);

  useAsyncEffect(async () => {
    let result: any = {};

    if (preview && !id) {
      result = schemaUtil.getData({ cache: true });
    } else if (id) {
      // 获取指定id的工作台信息
      if (type === 'template') {
        // 预览工作台模板
        result = await getWorkbenchTemplateById({ id });
      } else if (type === 'module') {
        // 预览模块首页
        result = await getHomepageNameById({ id });
      } else if (type === 'personal' || personal) {
        // 预览个人首页模版
        result = await getPersonalHomepageById({ id });
      } else {
        // 预览自定义工作台
        result = await getUserWorkbenchById({ id });
      }
    } else {
      const moduleCode = udp.getQueryValue('moduleCode')
      if (type === 'personal' || personal) {
        // 预览个人首页模版
        result = await getPersonalEnableHomepage(moduleCode);
      } else if (moduleCode) {
        // 传入一个模块编码获取已经启用的模块首页
        result = await getEnableHomepage(moduleCode)
      } else {
        // 获取默认启用的工作台
        result = await getUserEnableWorkbench();
      }
    }
    await loadResource(result?.packages, false);
    setStore({
      loading: false, value: result?.value, packages: result?.packages, session: preview ? 'preview' : 'render',
    });
  }, [personal]);

  const openPersonalDesign = () => {
    udp.open('/portal/design', {
      ...udp.getQueryValue(''), AppTitle: '个人模块门户设置', type: 'personal'
    });
  };

  return (
    <Layout loading={store.loading}
      style={{ pointerEvents: (preview ? 'none' : 'auto') }}
    >
      <ToastComponent key="toast" position="top-right" />
      {
        store.value ? renderAmis(store.value, {
          scopeRef: (amisScoped: any) => { global.amisScoped = amisScoped; },
        }, getAmisEnv(preview ? 'preview' : 'render')) : <Empty style={{ marginTop: 100 }} />
      }
      {personal && <FloatButton onClick={openPersonalDesign} tooltip="个人模块门户设置" icon={<SettingFilled style={{ color: cssVar.primaryColor }} />} shape="circle" />}
    </Layout>

  );
}

export default portalWrapper(UILayout, { isDesign: false });
